<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%@ include file="./common/taglibs.jsp"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>鲜橙服务</title>
<!--加载head和footer公用的css开始-->
<link charset="utf-8" type="text/css" href="css/common.css" rel="stylesheet"/>
<!--加载head和footer公用的css结束-->
<!--加载service页面的css开始-->
<link charset="utf-8" type="text/css" href="css/service.css" rel="stylesheet"/>
<!--加载service页面的css结束-->
<!--加载公用的jquery的js开始-->
<script type="text/javascript" src="js/jquery-1.4.js"></script>
<!--加载公用的jquery的js结束-->
<!--网页界面宽度随浏览器变化开始-->
<script type="text/javascript">
	$(document).ready(function(){
		var width = document.body.offsetWidth ;
		var w = width+"px";
		document.getElementById("headerActiveBac").style.width = w;
		document.getElementById("mainActiveBac").style.width = w;
		document.getElementById("footerMaskBac").style.width = w;
		document.getElementById("headerShadowBac").style.width = w;
	});
	
	window.onresize = function(){
		var width = document.documentElement.clientWidth;
		var w = width+"px";
		document.getElementById("headerActiveBac").style.width = w;
		document.getElementById("mainActiveBac").style.width = w;		
		document.getElementById("footerMaskBac").style.width = w;
		document.getElementById("headerShadowBac").style.width = w;
	}
</script>
<!--网页界面宽度随浏览器变化结束-->
<script type="text/javascript"> 
	 $(document).ready(function(){
		$("#name").focus( 
	           function(){ 
	               $("#name_label").css("display","none"); 
	     }).blur( 
	           function(){ 
	               $("#name").val() == "" && 
	               $("#name_label").css("display","block"); 
	           });
	    $("#mail").focus( 
	           function(){ 
	               $("#mail_label").css("display","none"); 
	     }).blur( 
	           function(){ 
	               $("#mail").val() == "" && 
	               $("#mail_label").css("display","block"); 
	           });
	    $("#phone").focus( 
	           function(){ 
	               $("#phone_label").css("display","none"); 
	     }).blur( 
	           function(){ 
	               $("#phone").val() == "" && 
	               $("#phone_label").css("display","block"); 
	           });
	    $("#companyName").focus( 
	           function(){ 
	               $("#companyName_label").css("display","none"); 
	     }).blur( 
	           function(){ 
	               $("#companyName").val() == "" && 
	               $("#companyName_label").css("display","block"); 
	           });
	    $("#companyWebsite").focus( 
	           function(){ 
	               $("#companyWebsite_label").css("display","none"); 
	     }).blur( 
	           function(){ 
	               $("#companyWebsite").val() == "" && 
	               $("#companyWebsite_label").css("display","block"); 
	           });
	    $("#programDesc").focus( 
	           function(){ 
	               $("#programDesc_label").css("display","none"); 
	     }).blur( 
	           function(){ 
	               $("#programDesc").val() == "" && 
	               $("#programDesc_label").css("display","block"); 
	           });
	    }); 
	    function requireDesignSubmit(){
	    	var form = document.getElementById("requireDesign");
	    	if(form.name.value=="")
	    		alert("请输入您的姓名！");
	    	else if(form.mail.value=="")
	    		alert("请输入您的邮件地址！");
	    	else if(form.phone.value=="")
	    		alert("请输入您的联系电话！");
	    	else if(form.companyName.value=="")
	    		alert("请输入您的公司名称！");
	    	else if(form.companyWebsite.value=="")
	    		alert("请输入您的公司网站");
	    	else if(form.programDesc.value=="")
	    		alert("请输入您的详细项目需求！");
	    	else{
	    		alert("发送成功！");
	    		form.submit();
	    	}
	    }
</script>
<style type="text/css"></style>
</head>
<body>
<!--页面内容开始-->
<div id="headerActiveBac" style="position:absolute; height:100px; background:url(image/headbac.png) repeat; overflow:visible; z-index:-100;"></div>
<div id="mainActiveBac" style=" margin-top:100px; position:absolute; height:298px; background:url(image/banner_service_ext.jpg) repeat; overflow:visible; z-index:-100;"></div>
<div id="headerShadowBac" style="position:absolute; height:6px; background:url(image/shadow.png) repeat-x scroll left top transparent; overflow:visible;margin-top:100px;z-index:100;"></div>
<div class="clearfloat"></div>
<div class="content">
  <!--页面头部开始-->
  <div class="header">
    <div id="header_logo"><a href="index.action"><img style="border:none;"src="image/logo.png" alt="logo"/></a></div>
    <div id="header_nav">
      <ul>
        <li><a href="index.action">首页</a></li>
        <li><a href="about.html">关于鲜橙</a></li>
        <li><a href="LoadCase.action">鲜橙案例</a></li>
        <li><a style="color:#ea5404;"  href="service.jsp">鲜橙服务</a></li>
        <li><a href="LoadProduct.action">鲜橙产品</a></li>
        <li><a href="contact.html">联系我们</a></li>
      </ul>
    </div>
  </div>
  <!--页面头部结束-->
  <div class="clearfloat"></div>
  <!--页面中间开始-->
  <div class="main">
    <!--页面中间导航开始-->
    <div id="main_nav"><img src="image/banner_service.jpg" /></div>   
    <!--页面中间导航结束-->
    <!--页面中间内容开始-->
    <div style="background-color:#FFF; height:300px;">
      <s:form action="SendEmailAction" id="requireDesign" name="requireDesign" onsubmit="requireDesignSubmit()" method="post">
        <h3 style="font-family:Microsoft Yahei; font-size:18px; color:#696969;border:thin; font-weight:normal; margin-left:30px; padding-top:30px;">请您填写设计需求表单：</h3>
        <fieldset id="fieldset">
			<s:label id="name_label" for="name" value="您的姓名" cssStyle="position:absolute;height:20px;line-height:20px;color:#909090;font-size:14px;float:left;margin-left:10px;padding-top:4px;"></s:label>
		  	<s:label id="mail_label" for="mail" value="您的邮件地址" cssStyle="position:absolute;height:20px;line-height:20px;color:#909090;font-size:14px;float:left;margin-left:270px;padding-top:4px;"></s:label>
		  	<s:label id="phone_label" for="phone" value="您的联系电话" cssStyle="position:absolute;height:20px;line-height:20px;color:#909090;font-size:14px;float:left;margin-left:680px;padding-top:4px;"></s:label>
			<s:label id="companyName_label" for="companyName" value="您的公司名称" cssStyle="position:absolute;height:20px;line-height:20px;color:#909090;font-size:14px;float:left;margin-top:38px;margin-left:10px;padding-top:5px;"></s:label>
			<s:label id="companyWebsite_label" for="companyWebsite" value="您的公司网站" cssStyle="position:absolute;height:20px;line-height:20px;color:#909090;font-size:14px;float:left;margin-top:38px;margin-left:270px;padding-top:4px;"></s:label>
		  	<s:label id="programDesc_label" for="programDesc" value="详细项目需求：如项目类型、时间规划、数量……" cssStyle="position:absolute;height:20px;line-height:20px;color:#909090;font-size:14px;float:left;margin-top:75px;margin-left:10px;"></s:label>
			<s:textfield id="name" name="name" value="" cssStyle="height:20px; width:240px; color:#909090;"/>
		  	<s:textfield id="mail" name="mail" value="" cssStyle="height:20px; width:385px; margin-left:10px; color:#909090;"/>
 			<s:textfield id="phone" name="phone" value="" cssStyle="height:20px; width:195px; margin-left:10px; color:#909090;"/>          
         	<br />
          <div style="margin-top:10px;">
			<s:textfield id="companyName" name="companyName" value="" cssStyle="height:20px; width:240px; color:#909090;"/>  
            <s:textfield id="companyWebsite" name="companyWebsite" value="" cssStyle="height:20px; width:385px; margin-left:10px; color:#909090;"/>            
          </div>
		  <div style="margin-top:5px; float:left;">
          	<s:textarea id="programDesc" name="programDesc" value="" cssStyle="float:left; margin:0 auto;height:65px; width:645px;color:#909090;font-size:14px;" />
			<!--<s:submit  value="完成发送" > </s:submit>-->
			<div style="margin-top:0px; float:left; margin-left:5px;"><a style="margin-left:10px;" onclick="requireDesignSubmit()"><img src="image/button_submit.png" /></a></div>
    		<!--  <input type="image" src="image/button_submit.png" style="margin-left:10px;" onclick="requireDesignSubmit()" />-->
          </div>
		</fieldset>
      </s:form>
    </div>
    <div style="background-color:#FFF; height:800px; margin-bottom:30px;">     
        <h3 style="font-family:Microsoft Yahei; font-size:18px; border:thin; font-weight:normal; margin-left:30px; padding-top:30px; color:#ea5404;">我们服务的品牌</h3>
        <div id="brandImage">
			<ul style="">
				<li><a><img src="image/logo/logo-01.jpg"/></a></li>
            	<li><a><img src="image/logo/logo-02.jpg"/></a></li>
            	<li><a><img src="image/logo/logo-03.jpg"/></a></li>
				<li><a><img src="image/logo/logo-04.jpg"/></a></li>
				<li><a><img src="image/logo/logo-05.jpg"/></a></li>
				<li><a><img src="image/logo/logo-06.jpg"/></a></li>
	        </ul>
	        <ul>
	        	<li><a><img src="image/logo/logo-07.jpg"/></a></li>
            	<li><a><img src="image/logo/logo-08.jpg"/></a></li>
            	<li><a><img src="image/logo/logo-09.jpg"/></a></li>
				<li><a><img src="image/logo/logo-10.jpg"/></a></li>
				<li><a><img src="image/logo/logo-11.jpg"/></a></li>
				<li><a><img src="image/logo/logo-12.jpg"/></a></li>
	        </ul>
	        <ul>
	        	<li><a><img src="image/logo/logo-13.jpg"/></a></li>
            	<li><a><img src="image/logo/logo-14.jpg"/></a></li>
            	<li><a><img src="image/logo/logo-15.jpg"/></a></li>
				<li><a><img src="image/logo/logo-16.jpg"/></a></li>
				<li><a><img src="image/logo/logo-17.jpg"/></a></li>
				<li><a><img src="image/logo/logo-18.jpg"/></a></li>
	        </ul>
	    
		</div>
        <div id="brandLink">
          <ul>
            <li><a>金龙鱼</a></li>
            <li><a>腾讯科技</a></li>
            <li><a>深圳盐田国际</a></li>
            <li><a>深圳市中和正道咨询</a></li>
          </ul>
		  <div class="clearfloat"></div>
          <ul>
            <li><a>五粮液</a></li>
            <li><a>新浪网</a></li>
            <li><a>深圳盐田港</a></li>
            <li><a>广西柳州钢铁</a></li>
          </ul>
		  <div class="clearfloat"></div>
          <ul>
            <li><a>金六福酒</a></li>
            <li><a>百度</a></li>
            <li><a>深圳华南物流</a></li>
            <li><a>珠海德豪润达</a></li>
          </ul>
		  <div class="clearfloat"></div>
          <ul>
            <li><a>六福人家酒（华致红酒）</a></li>
            <li><a>网通北京分公司</a></li>
            <li><a>中国银行总行（北京）</a></li>
            <li><a>华全医药味元堂</a></li>
          </ul>
		  <div class="clearfloat"></div>
		  <ul>
            <li><a>中烟集团（澳洲）</a></li>
            <li><a>太古地产（广州）</a></li>
            <li><a>中国银行（深圳）</a></li>
            <li><a>&nbsp;</a></li>
          </ul>
		  <div class="clearfloat"></div>
		  <ul>
            <li><a>喜力啤酒</a></li>
            <li><a>湖南湘天置业</a></li>
            <li><a>中国人民保险</a></li>
            <li><a>&nbsp;</a></li>
          </ul>
		  <div class="clearfloat"></div>
  		  <ul>
            <li><a>百加德冰锐</a></li>
            <li><a>长沙奥林匹克花园</a></li>
            <li><a>加拿大ALD建筑</a></li>
            <li><a>&nbsp;</a></li>
          </ul>
     </div>
    </div>
    <!--页面中间内容结束-->
  </div>
  <!--页面中间结束-->
  <div class="clearfloat"></div>
  <!--页面底部开始-->
  <div class="footer">
    <div id="footer_nav">
      <ul>
        <li><a href="index.action">首页</a></li>
        <li><a href="about.html">关于鲜橙</a></li>
        <li><a href="LoadCase.action">鲜橙案例</a></li>
        <li><a href="service.jsp">鲜橙服务</a></li>
        <li><a href="LoadProduct.action">鲜橙产品</a></li>
        <li><a href="contact.html">联系我们</a></li>
      </ul>
      <div style="margin-left:80px; margin-top:37px;"><span style="font-size:12px; color:#696969; font-weight:bold;"> © 2011 SUNSUM All rights reserved.</span></div>
    </div>
  </div>
  <!--页面底部结束-->
</div>
<div id="footerMaskBac" style=" margin-top:-120px; position:absolute; height:120px; background:url(image/footerBac_ext.png) repeat; overflow:visible; z-index:-100;"></div>
<!--页面内容结束-->
</body>
</html>
